<template>
    <view class="g-page">
		<view class="bg"><image src="https://jewel.gdhenglang.com/static/images/wxbg.png" mode="widthFix" ></image></view>
		<view class="user-pic"><image :src="userHeaderPic" mode="widthFix" ></image></view>
		<button open-type='getUserInfo' @getuserinfo='loginBtn' class="login-btn" v-if="!isLogin">授权登录</button>
		<view class="cancel" @tap="cancel_auth">取消</view>
    </view>
</template>


<script>
	import henglang from '@/common/common_zb.js';
    export default {
        data() {
            return {
			   userHeaderPic: '../../../static/images/jewel/mo_tou.png'
            };
        },
        methods: {
            loginBtn(e){
				henglang.wx_getuserinfo(e, function (){
					uni.navigateBack({});
				})
			},
			cancel_auth(){
				uni.navigateBack();
			}
        },
        onLoad() {
			let that = this;
			uni.login({
				provider: 'weixin',
				success: function (loginRes) {
					if(loginRes.errMsg == "login:ok") {
						uni.getUserInfo({
							provider: 'weixin',
							success (infoRes) {
								that.userHeaderPic = infoRes.userInfo.avatarUrl;
							},
							fail (res){
								that.userHeaderPic = '../../../static/images/jewel/mo_tou.png';
							}
						});
					}else{
						that.userHeaderPic = '../../../static/images/jewel/mo_tou.png';
					}
				}
			});
		}
    }
</script>
<style>
	image{
		width: 100%;
		height: 100%;
	}
	.g-page{
		max-width: 100%;
		overflow: hidden;
	}
	.g-page .bg{
		width: 100%;
		height: 100%;
	}
	.user-pic{
		position: absolute;
		top: 480upx;
		width: 159upx;
		height: 159upx;
		left: 50%;
		margin-left: -80upx;
		overflow: hidden;
		z-index: 10;
		border-radius: 50%;
	}
	.login-btn{
		width: 400upx;
		height: 88upx;
		text-align: center;
		color: #FFFFFF;
		font-size: 40upx;
		line-height: 88upx;
		border-radius: 50px;
		background: #d71511;
		position: absolute;
		bottom: 64rpx;
		left: 47%;
		margin-left: -177upx;
	}
	.cancel{
		position: absolute;
		bottom: -23rpx;
		color: #9c9c9c;
		font-size: 35rpx;
		left: 45%;
	}
</style>
